<script>
import { defineComponent } from "vue";

export default defineComponent({
  name: "indexView",
  data() {
    return {
      btnText: "点击关灯",
      box: "bgcolor",
      flag: false,
    };
  },
  methods: {
    light() {
      this.flag = !this.flag;
      this.flag === false ? (this.btnText = "点击关灯") : (this.btnText = "点击开灯");
    },
  },
});
</script>

<template>
  <div class="content">
    <div :class="flag ? 'bgcolor' : ''" style="min-height: 100vh">
      <button v-for="num in 10" :key="num" v-text="btnText" @click="light"></button>
    </div>
  </div>
</template>

<style scoped lang="less">
.bgcolor {
  background-color: black;
}
</style>
